<!DOCTYPE html>

<html class="pixel-ratio-1">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0">
    <title>复制</title>
    <!--<link href="js/ylx.css" rel="stylesheet">-->
    <style>
        body{background-color: #DC143C;}
        #content {text-align: center;color:#fff;margin: 5%;font-size: 1rem;}
        #content .core{background-color: #fff;padding: 0.5rem;border-radius:0.5rem;margin-top: 300px;}
        #content .img_p img{width: 100%;border-radius:0.5rem;}
        #content .inp{margin-top:1rem;height: 3rem;line-height: 3rem;width:100%;color:#000;background-color:#eee;border: 0;border-radius: 0.3rem; font-size: 1.4rem;padding: 0.1rem;margin-top: 0.3rem;}
        #content .inp input{text-align:center;border: 0;height: 3rem;line-height: 3rem;font-size: 1.2rem;background-color:#eee;}
        #content .btn{margin-top:1rem;height: 3rem;line-height: 3rem;width:100%;color:#fff;background-color:#F37B1D;border: 0;border-radius: 0.3rem; font-size: 1.4rem;padding: 0.1rem;margin-top: 0.3rem;}
        #t{border-radius: 0.3rem; font-size: 1.4rem;padding: 0.1rem;margin: 0.3rem 0;color:#000;}
    </style>
</head>
<body>
<div id="content">
    <div class="core">
        <p id="t"></p>
        <p class="inp"><input id="tkl" type="text" value="" readonly></p>
        <p></p>
        <button class="btn">一键复制</button>
    </div>
</div>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script src="js/clipboard.min.js"></script>
<script type="text/javascript" src="js/jquery.tips.js"></script>
<script>
    function request(paras) {
        var url = location.href;
        var paraString = url.substring(url.indexOf("?") + 1, url.length).split("&");
        var paraObj = {}
        for (i = 0; j = paraString[i]; i++) {
            paraObj[j.substring(0, j.indexOf("=")).toLowerCase()] = decodeURIComponent(j.substring(j.indexOf("=") + 1, j.length));
        }
        var returnValue = paraObj[paras.toLowerCase()];
        if (typeof(returnValue) == "undefined") {
            return "";
        } else {
            return returnValue;
        }
    }
    $(function(){
        var data = request("data");
        var tkl ="";
        var t = "";
        if (data){
            var da = JSON.parse(data);
            tkl = da.tkl;
            t = da.t;
        }
        $("#t").html(t);
        $("#tkl").val(tkl);
        var clipboard = new ClipboardJS('.core', {
            text: function() {
                return tkl;
            }
        });
        clipboard.on('success', function(e) {
            $(".btn").html("复制成功!").css("background-color","#5eb95e");
            $("#tkl").tips({
                side : 3,
                msg : '复制成功!',
                bg : '#AE81FF',
                time : 3
            });
        });
        clipboard.on('error', function(e) {
            $(".btn").html("请手动复制!").css("background-color","#DC143C");
            $("#tkl").tips({
                side : 3,
                msg : '请手动复制!',
                bg : '#AE81FF',
                time : 3
            });
        });
//        $("#imgUrl").attr('src',img);
    });
</script>

</body>
</html>